<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    let xhr = new XMLHttpRequest();
    // 前端发送请求的时候，可以携带cookie，但是cookie是不能跨域
    document.cookie = "name=zhangshan"
    xhr.open('PUT', 'http://localhost:4000/getdata', true);
    // 如果需要携带cookie，就需要设置这个，并且还要在服务端设置
    xhr.withCredentials = true;
    // 前端设置请求头，Content-type也需要设置，否则会报错，报错信息（The object's state must be OPENED.） 还要在服务端设置请求头
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded; chartset=utf-8");
    xhr.setRequestHeader('name', 'zhangshan');
    xhr.onreadystatechange = function () {
      if(xhr.readyState === 4) {
        if(xhr.status >= 200 && xhr.status <= 300 || xhr.status === 304) {
          console.log(xhr.response)
          // 获取响应头信息，还需要在后端设置允许获取响应头信息
          console.log(xhr.getResponseHeader('name'))
        }
      }
    }
    xhr.send();
  </script>
</body>
</html>